<div class="container" data-ng-controller="GnLoginController" role="main">
    <div class="col-lg-4 col-md-4 col-md-offset-4 col-lg-offset-4">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h1 data-translate="">updatePassword</h1>
      </div>
      <div class="panel-body">
        <form class="form-horizontal" id="userinfo" name="gnUserEdit">
         <input type="hidden" name="_csrf" value="{{csrf}}"/>
          <input type="hidden"
                 data-ng-model="changeKey"
                 name="changeKey" value="{{changeKey}}"/>

          <div class="form-group">
            <label data-translate="">username</label>
            <input type="text"
                    class="form-control"
                    disabled=""
                    aria-label="{{'username' | translate}}"
                    data-ng-model="userToRemind"/>
            <!-- Hidden field to be sent - the other one is disabled-->
            <input type="hidden" name="username" value="{{userToRemind}}"/>
          </div>

          <!-- Password are disabled when updating user -->
          <div class="form-group"
               data-ng-class="gnUserEdit.password.$valid != true ? 'has-error' : ''">
            <label data-translate="">password</label>
            <input type="password"
                    id="gn-user-password"
                    name="password"
                    class="form-control"
                    autocomplete="off"
                    required="required"
                    aria-label="{{'password' | translate}}"
                    data-ng-minlength="6"
                    data-ng-model="password"/>
            <p class="help-block">
              <span class="error" ng-show="gnUserEdit.password.$error.minlength" data-translate=""
              >passwordMinlength</span>
            </p>
          </div>
          <div class="form-group"
               data-ng-class="gnUserEdit.password.$valid == false ||
                        (passwordCheck !== password) ? 'has-error' : ''">
            <label data-translate="">passwordRepeat</label>
            <input type="password"
                    id="gn-user-password2"
                    name="password2"
                    class="form-control"
                    autocomplete="off"
                    aria-label="{{'passwordRepeat' | translate}}"
                    data-ng-model="passwordCheck"/>
            <p class="help-block">
              <span class="error"
                    ng-show="gnUserEdit.password.$valid
                                && passwordCheck != password"
                    data-translate="">passwordNotMatching</span>
            </p>
          </div>
        </form>
        <button data-ng-click="updatePassword('#userinfo')"
                data-ng-disabled="!gnUserEdit.$valid"
                class="btn btn-primary btn-block">
          <i class="fa fa-fw fa-save"/>
          <span data-translate="">updatePassword</span>
        </button>
      </div>
    </div>
  </div>
</div>
